import React, { Component } from 'react';
import { Table, Pagination } from 'antd';
import moment from 'moment';

class ApprovingTable extends Component {
  render() {
    const columns = [{
      title: 'No.',
      key: 'id',
      render: (text, record) => {
        return (
          <div>{record.id}</div>
        )
      }
    }, {
      title: 'Name',
      width: 180,
      dataIndex: 'nickname',
    }, {
      title: 'Phone',
      dataIndex: 'mobile',
    }, {
      title: 'Integral',
      dataIndex: '',
    }, {
      title: 'Cash',
      dataIndex: '',
    }, {
      title: 'Contribute',
      dataIndex: '',
    }, {
      title: 'RegisterTime',
      render: (text, record) => {
        return (
          <div>{moment(record.gmtCreate).format('YYYY-MM-DD MM:ss')}</div>
        )
      }
    },{
      title: 'State',
      dataIndex: '',
    }, {
      title: 'Operation',
      render: (record) => {
        return (
          <div className="edit-config">
            <span className="edit-text" onClick={() => this.props.toDetails(record.id)}>Detail</span>
            <span className="edit-text">Lock</span>
          </div>
        )
      }
    }];

    return (
      <div className="">
        <Table
          rowKey="id"
          className="select-table"
          dataSource={this.props.dataSource}
          columns={columns}
          pagination={false} />
        <Pagination
          className="tr mt10"
          showQuickJumper
          showSizeChanger
          showTotal={total => `Total ${total}`}
          total={this.props.dataTotal}
          onChange={this.props.pageOnChange}
          onShowSizeChange={this.props.pageSizeOnChange}
          current={this.props.pageCurrent} />
      </div>
    )
  }
}

export default ApprovingTable;
